<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css_文本对齐_垂直方向</title>
    <style>
        #szm {
            font-size: 20px;
            background-color: orange;
            line-height: 180px;
            height: 100px;
        }
    </style>
</head>
<body>

<!--
    1.顶部对齐：无需任何属性，在垂直方向上，默认就是顶部对齐的。
    2.居中对齐：对于单行文本来说，直接让height = line-height 就可以居中了。
    3.底部对齐:对于单行文字来说，目前有一个临时解决办法让line-height = height * 2 - font-size-x
    x是根据字体族大小来设置的，但是目前还没有找到一个好的解决方案。
-->


<div id="szm">这是单行文本文字</div>


</body>
</html>